<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>【相邻，通用】兄弟选择器</title>
		<style>
		 	/* 相邻兄弟选择器：用途：找到当前元素相邻的元素【针对平行结构】
			 语法：当前元素选择器+相邻的元素选择器{}*/
			 /* h2+p{
				  /* 找到h1旁边的第一个p元素 */
				/*  color: #0ffa00;
			  } 
			  /* 通用兄弟选择武器：用途：找到当前元素名字一致的其他元素【针对平行结构】
			   语法；当前元素选择器~相邻的元素选择器*/
			 h2~span{
				color: #7fcdaa;
			  } 
			  
			  /* 通用选择器  匹配页面上所有元素   作用：全局设置*/
			/*  *{
				  color: #7fcdff;
				  background: #7aff00;
			  } */
		</style>
	</head>
	<body>
		<h2>相邻兄弟选择器</h2>
		<span>lorem1</span>
		<span>lorem2</span>
		<span>lorem3</span>
		
		<h3>每当想起你时</h3>
		<i>这世界那么多人</i>
		<p>故事的小黄花</p>
	</body>
</html>